{extend name="public/layerbase" /}
{block name="css"}
<link rel="stylesheet" type="text/css" href="__STATIC__/common/layui/css/layui.css">
<style>
    .fallback{background: #6fb3e0;  position:relative;text-align: center;line-height:34px;  float: left;height:34px;width:110px;}
    .chuanfile{font-size:20px;color:white;}
    #file{ cursor: pointer;  font-size: 30px;  outline: medium none;  filter:alpha(opacity=0);  -moz-opacity:0;  opacity:0;position: absolute;top:0;}
    .uploadfile{padding:0 !important;}
    .uploadfiles{padding-right:0 !important;}
    #iconPic{width:20px;height:20px;border:0 solid #fff;}
    .jianyi{height:34px;line-height:34px;margin-left:10px;color:darkred;}
    #iconBtn{background:#6fb3e0;color:white;}

</style>

{/block}

{block name="content"}

<div class="main-container" id="main-container">
    <div class="main-content">
        <div class="page-content">
            <div class="page-content-area">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="widget-box">
                            <div class="widget-header widget-header-blue widget-header-flat">
                                <h4 class="widget-title lighter">修改渠道</h4>
                            </div>
                            <div class="widget-body">
                                <div class="widget-main">
                                    <div class="step-content pos-rel" >
                                        <div class="step-pane active" >
                                            <form class="form-horizontal " id="form" method="post">
                                                <input type="hidden" name="id"  value="{$qudao.id}">
                                                <div class="form-group">
                                                    <label class="col-sm-3 control-label no-padding-right" > 渠道名称：</label>
                                                    <div class="col-sm-7">
                                                        <div class="clearfix">
                                                            <input type="text" name="title" placeholder="请输入渠道名称" class="col-xs-12 col-sm-9" value="{$qudao.title}"/>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label class="col-sm-3 control-label no-padding-right" > 类型：</label>
                                                    <div class="col-sm-7">
                                                        <div class="clearfix">
                                                            <select class="col-xs-12 col-sm-9 form-control" name="type" id="type">
                                                                <option value="1" {eq name="qudao.type" value="1"}selected{/eq}>线上渠道</option>
                                                                <option value="2" {eq name="qudao.type" value="2"}selected{/eq}>线下渠道</option>
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>


                                                <div class=" form-group" id="uploadImg" >
                                                    <label class="col-sm-3 control-label no-padding-right">渠道图标:</label>
                                                    <input type="hidden" name="path" id="icon" value="{$qudao.path}">
                                                    <div class="col-sm-5 uploadfiles">
                                                        <div class="col-xs-6 col-sm-9 form-control photo">
                                                            <img class="layui-upload-img" id="iconPic" {neq name="$qudao.path" value="0"}src="{$qudao.path}"{/neq}>
                                                            <p id="iconText"></p>
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-4 uploadfile" >
                                                        <div class="clearfix fallback">
                                                            <button type="button" class="col-xs-8 col-sm-9 form-control" id="iconBtn" style="float: left;"><i class="icon icon-upload3"></i>点击上传</button>
                                                        </div>
                                                        <div class="jianyi" style="margin-left: 10px;">*建议大小：20×20</div><div style="clear: both"></div>
                                                    </div>
                                                </div>

                                                <!--<div class="form-group" style="display:none;" id="qudaobox">-->
                                                    <!--<label class="col-sm-3 control-label no-padding-right" > 渠道：</label>-->
                                                    <!--<div class="col-sm-7">-->
                                                        <!--<div class="clearfix">-->
                                                            <!--<select class="col-xs-12 col-sm-9 form-control" name="pid" id="qudao">-->
                                                                <!--{volist name="pid" id="vo"}-->
                                                                    <!--<option value="{$vo.id}" {eq name="qudao.pid" value="$vo.id" } selected {/eq}>{$vo.title}</option>-->
                                                                <!--{/volist}-->
                                                            <!--</select>-->
                                                        <!--</div>-->
                                                    <!--</div>-->
                                                <!--</div>-->

                                                <div class="form-group xianxia">
                                                    <label class="col-sm-3 control-label no-padding-right" > 线下渠道类别：</label>
                                                    <div class="col-sm-7">
                                                        <div class="clearfix">
                                                            <select class="col-xs-12 col-sm-9 form-control" name="xxqdclassify" id="">
                                                                {volist name="classify_pid" id="vo"}
                                                                <option value="{$vo.id}" {eq name="qudao.xxqdclassify" value="$vo.id" } selected {/eq}>{$vo.title}</option>
                                                                {/volist}
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label class="col-sm-3 control-label no-padding-right" > 排序：</label>
                                                    <div class="col-sm-7">
                                                        <div class="clearfix">
                                                            <input  type="text" name="sort" class="col-xs-12 col-sm-9 form-control" value="50" >
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label class="col-sm-3 control-label no-padding-right">是否启用:</label>
                                                    <div class="col-sm-9">
                                                        <div class="clearfix">
                                                            <input name="status" value="1" type="checkbox" checked/>
                                                        </div>
                                                    </div>
                                                </div>

                                                <hr />
                                                <div class="clearfix" style="text-align: center">
                                                    <div class="col-md-offset-3 col-md-9">
                                                        <!--{:token()}-->
                                                        <button class="btn btn-info" type="submit" id="submit">
                                                            <i class="ace-icon fa fa-check bigger-110"></i>
                                                            提交
                                                        </button>

                                                        &nbsp; &nbsp; &nbsp;
                                                        <button class="btn" type="reset">
                                                            <i class="ace-icon fa fa-undo bigger-110"></i>
                                                            重置
                                                        </button>
                                                    </div>
                                                </div>
                                            </form>

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

{/block}

{block name="js"}
<script src="__STATIC__/common/layui/layui.js"></script>

<script>
    $(function () {
        var  type = $('#type');
        var  xianxia = $('.xianxia');
        if(type.val()==1){
            xianxia.hide();
        }else{
            xianxia.show();
        }
        type.change(function () {
            if($(this).val()==1){
                xianxia.hide();
            }else{
                xianxia.show();
            }
        });
    });
    var define_fileds =  {
        name: {
            message: '幼儿园验证失败',
            validators: {
                notEmpty: {
                    message: '幼儿园不能为空'
                },
            }
        },
    };
    var ajaxurl = "{:url('edit')}";


    layui.use(['upload'], function () {
        var upload = layui.upload;

        //图标上传
        var uploadInst = upload.render({
            elem: '#iconBtn'
            ,url: '{:url("Upload/upload")}'
            ,accept:'images'
            ,exts:'jpg|png|gif|ico|bmp|jpeg'
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#iconPic').attr('src', result); //图片链接（base64）
                });
            },
            done: function(res){
                if(res.code>0){
                    $('#icon').val(res.url);
                }else{
                    //如果上传失败
                    return layer.msg('上传失败');
                }
            }
            ,error: function(){
                //演示失败状态，并实现重传
                var demoText = $('#iconText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });

            }
        });
    });

</script>


{/block}